<template>
  <!-- 面包屑导航区域 -->
  <div class="container">
    <bread-crumb>
      <template v-for="(path, index) in pathList">
        <transition appear
                    mode="out-in"
                    name="fade-right">
          <bread-crumb-item :key="path.name"
                            :label="path.name"
                            :to="path.path"/>
        </transition>
      </template>
    </bread-crumb>
  </div>

  <!-- 内容区域 -->
  <router-view/>
</template>

<script lang="ts"
        setup>
import BreadCrumb from '@/components/library/BreadCrumb.vue'
import BreadCrumbItem from '@/components/library/BreadCrumbItem.vue'
import {useCommonStore} from '@/stores/common'
import {storeToRefs} from 'pinia'

let commonStore = useCommonStore()
let {pathList} = storeToRefs(commonStore)
</script>